<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<div id="noticeChoice" style="display: none;">
	<div class="areaChoice">
		<div class="areaChoice-left">
			<div class="areaChoice-left-con">
				<div class="areaChoice-leftpro">选择角色</div>
				<ul id="roleName" name="provinceId" class="citychioce"></ul>
			</div>	
		</div>
		<div class="areaChoice-middle">
			<div class="areaChoice-middle-con">
				<div class="areaChoice-leftpro">选择人员</div>
				<ul id="usersName"  class="manchioce"></ul>
			</div>
		</div>
	</div>
	<div class="buttonSuccess">
		<button type="button" class="btn dpbtn_green" onclick="savecachedUsers();">确定</button>
		<button type="button" class="btn dpbtn_red" onclick="ResetcachedUsers();">重置</button>
	</div>
</div>	
<script type="text/javascript">
function roleName(obj, roleId){
	$(obj).addClass("proactive");
	$(obj).siblings("li").removeClass("proactive");
	var noticeRole = noticeUsersMap[roleId];
	renderNoticeUser(noticeRole.sysUsers);
} 

var noticeUsersMap={hasValues:false};

function getDataS(roleId) {
	if(!noticeUsersMap || !noticeUsersMap.hasValues) {
		$.dpAjax({
			show:false,
	 		url:'${basePath}/role/getNoticeUsers',
			data:{roleId:roleId},
			success: function(datas){
				var noticeRoles = datas.result;
				renderNoticeRole(noticeRoles);
			}
	 	});
	}
}

function renderNoticeRole(noticeRoles) {
	var length = !noticeRoles ? 0 : noticeRoles.length;
	if(length == 0) {
		return;
	}
	var html='';
	noticeUsersMap.hasValues = true;
	for(var i=0; i<noticeRoles.length; i++){
		var roleName = noticeRoles[i].sysRole.roleName;
		var roleCode = noticeRoles[i].sysRole.roleCode;
		var roleId = noticeRoles[i].sysRole.replaceId;
		
		noticeUsersMap[roleId] = noticeRoles[i];
		if(i == 0) {
			html += "<li onclick=\"roleName(this,'" + roleId + "');\" class='proactive'>" + roleName+ "</li>";
		} else {
			html += "<li onclick=\"roleName(this,'" + roleId + "');\">" + roleName+ "</li>";
		}
	}
	$("#roleName").html(html);
	
	renderNoticeUser(noticeRoles[0].sysUsers);
}

var cachedUsers = [];
function renderNoticeUser(sysUsers) {
	var content='';
	var sysUserslength = sysUsers.length;
	for(var j = 0; j<sysUserslength; j++){
		var loginName = sysUsers[j].loginName;
		var userId = sysUsers[j].replaceId;
		if($.inArray(userId, cachedUsers) != -1) {
			content += "<li onclick=\"userName(this,'" + userId + "');\" class='proactiveIcon'>" + loginName + "</li>";
		} else {
			content += "<li onclick=\"userName(this,'" + userId + "');\" >" + loginName + "</li>";
		}
	}
	$("#usersName").html(content);	
}

function userName(obj, userId) {
	if($(obj).hasClass("proactiveIcon")) {
		var userIdIndex = 0;
		while((userIdIndex = $.inArray(userId, cachedUsers)),userIdIndex != -1) {
			cachedUsers.splice(userIdIndex, 1);
		}
		$(obj).removeClass("proactiveIcon");
	} else {
		cachedUsers.push(userId);
		$(obj).addClass("proactiveIcon");
	}
}

//重置
function ResetcachedUsers(){
	cachedUsers = [];
	$("#usersName").find("li").removeClass("proactiveIcon");
}
</script>




